<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>海蓝之谜护肤品满意度调查</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <form action="mailto:2336775770@qq.com">
        <table>
            <tbody>
                <tr>
                    <th>
                        <img src="images/background.webp" alt="">
                    </th>
                </tr>
                <th>
                    <h1>海蓝之谜护肤品满意度调查</h1>
                </th>
                <tr>
                    <td>
                        <label for="">您所在的地区是？</label>
                        <br>
                        <input type="text" value="西安" readonly>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="name">1、您的姓名？</label>
                        <br>
                        <input type="text" value="李女士" maxlength="4">
                    </td>
                    
                </tr>
                <tr>
                    <td>
                        <label for="email">2、您的邮箱是？</label>
                        <br>
                        <input name="email" type="email">
                    </td>
                    
                </tr>
                <tr>
                    <td>
                        <label for="age">3、您的年龄是？</label>
                        <br>
                        <input name="age" type="number">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="password">4、您的手机号码是？</label>
                        <br>
                        <input type="password" type="password" placeholder="请输入您的手机号码">
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="zhiye">5、您的职业是？</label>
                        <br>
                        <select name="zhiye" id="">
                            <option value="学生">学生</option>
                            <option value="上班族">上班族</option>
                            <option value="家庭主妇">家庭主妇</option>
                            <option value="其他">其他</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="leixing">6、您皮肤的类型是？</label>
                        <br>
                        <input type="radio" name="leixing" value="干皮"><label for="干皮">干皮</label>
                        <input type="radio" name="leixing" value="油皮"><label for="油皮">油皮</label>
                        <input type="radio" name="leixing" value="混干"><label for="混干">混干</label>
                        <input type="radio" name="leixing" value="混油"><label for="混油">混油</label>
                        <input type="radio" name="leixing" value="不太清楚"><label for="不太清楚">不太清楚</label>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="xiaoguo">7、您使用化妆品想达到什么效果呢？</label>
                        <br>
                        <input type="checkbox" name="teach" value="保湿"><label for="保湿">保湿</label>
                        <input type="checkbox" name="teach" value="祛痘"><label for="保湿">祛痘</label>
                        <input type="checkbox" name="teach" value="补水"><label for="保湿">补水</label>
                        <input type="checkbox" name="teach" value="美白"><label for="保湿">美白</label>
                        <input type="checkbox" name="teach" value="淡斑"><label for="保湿">淡斑</label>
                        <input type="checkbox" name="teach" value="去皱"><label for="保湿">去皱</label>
                        <input type="checkbox" name="teach" value="其他"><label for="保湿">其他</label>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="range">8、您对海蓝之谜护肤品的评价？</label>
                        <br>
                        <input min="1" max="10" type="range" name="range" onchange="document.getElementById('show').innerHTML=value">
                        <span id="show"></span>
                    </td>
                </tr>
                <tr>
                    <td>
                        <label for="suggest">9、您对海蓝之谜护肤品的意见：（必填）</label>
                        <br>
                        <textarea name="suggest" cols="100" rows="5" required></textarea>
                    </td>
                </tr>
                <tr>
                    <th>
                        <input class="new_button" type="submit">
                        <input class="new_button" type="reset">
                    </th>
                </tr>

            </tbody>
        </table>

    </form>


</body>
</html>